<template>
  <div class="layout _wz_main_css" style="height: 100%;">
    <Layout style="height: 100%;">
      <Header
        :class="(!!systemStyle.systemStyle)?(systemStyle.systemStyle == 'top' || systemStyle.systemStyle == 'topLeft')?(!!systemStyle.subjectColor)?systemStyle.subjectColor:'_wz_1d1e23':'':(!!systemStyle.subjectColor)?systemStyle.subjectColor:'_wz_1d1e23'">
        <Menu mode="horizontal" theme="dark" active-name="1">
          <div style="overflow: hidden;">
            <div class="_wz_main_logo"></div>
            <div class="layout-logo" @click="refreshToke" style="font-size: 24px;letter-spacing: 2px;margin: 0px;height: 60px;line-height: 60px;cursor: pointer;">
              交通运输企业管理
            </div>

            <div class="layout-nav">
              <Tooltip :content="value ? '退出全屏' : '全屏'" style="margin: 0 5px;">
                <Icon :type="value ? 'md-contract' : 'md-expand'" style="font-size: 23px;" @click="handleFullscreen" />
              </Tooltip>
              <Tooltip content="系统风格" style="margin: 0 5px;cursor: pointer;">
                <Icon type="md-more" style="font-size: 23px;" @click="systemStyleTypeFun" />
              </Tooltip>
              <Dropdown @on-click="changeMenu" placement="bottom-end">
                <a href="javascript:void(0)" class="user-avatar-dropdown">
                  <div class="ivu-dropdown-rel">
                  <span class="ivu-badge">
                    <span>{{userInfoData.name}}</span>
                  </span>
                    <i class="ivu-icon ivu-icon-md-arrow-dropdown" style="font-size: 18px;"></i>
                  </div>
                </a>
                <DropdownMenu slot="list">
                  <DropdownItem name="user" v-ButtonPerm="'manage:personalCenter:personalCenter:view'">个人信息
                  </DropdownItem>
                  <DropdownItem name="deptInfo">企业信息</DropdownItem>
                  <DropdownItem name="allocation" v-ButtonPerm="'manage:personalCenter:companyConfig:view'">企业配置
                  </DropdownItem>
                  <DropdownItem name="password" v-ButtonPerm="'manage:personalCenter:password:view'">修改密码</DropdownItem>
                  <DropdownItem divided name="logOff" v-if="!!!exitStatus">退出登录</DropdownItem>
                </DropdownMenu>
              </Dropdown>
            </div>
          </div>

        </Menu>
      </Header>
      <Layout style="height: calc(100% - 64px - 30px);">
        <Sider hide-trigger class="_wz_leftNav" :class="(!!systemStyle.systemStyle)?(systemStyle.systemStyle == 'left' || systemStyle.systemStyle == 'topLeft')?(!!systemStyle.subjectColor)?systemStyle.subjectColor:'_wz_1d1e23':(!!systemStyle.subjectColor)?systemStyle.subjectColor+'_cyan':'_wz_1d1e23_cyan':(!!systemStyle.subjectColor)?systemStyle.subjectColor+'_cyan':'_wz_1d1e23_cyan'" :style="{background: '#fff',width: '240px','min-width': '240px','max-width': '240px','overflow': 'auto'}">
          <wz-Nav ref="wzNav" @topNavList="topNavListFun" :navSelect="navSelect"></wz-Nav>
        </Sider>
        <Layout>
          <div class="tag-nav-wrapper" v-if="systemStyle.multiTabbed">
            <wz-Tabs ref="wzTabs" :navId="navId" :listNav="listNav" @leftNavList="leftNavList" @openNav="openNavFun"></wz-Tabs>
          </div>
          <Content class="content-wrapper" :style="{padding: '24px',padding: '0px',height:' calc(100% - 80px)',overflow: 'auto'}">
            <!--<Content class="content-wrapper":style="{padding: '24px', background: '#fff',padding: '18px',height:' calc(100% - 80px)',overflow: 'auto'}">-->
            <!--<keep-alive :include="include">-->
            <!--<router-view></router-view>-->
            <!--</keep-alive>-->
            <keep-alive>
              <router-view v-if="$route.meta.keepAlive"></router-view>
            </keep-alive>
            <router-view v-if="!$route.meta.keepAlive"></router-view>
          </Content>
        </Layout>
      </Layout>
      <Footer style="z-index: 999;padding: 0px;height: 30px;">
        <div class="_wz_foot" :class="!!systemStyle.subjectColor ? systemStyle.subjectColor:'_wz_1d1e23'">
          <span>备案序号：冀ICP备18004049号-2</span> <span>CopyRight © 河北信达交通科技有限公司</span> <span>技术支持：河北信达交通科技有限公司</span>
          <!--<a href="http://www.baidu.com" target="view_window">使用手册</a>-->
        </div>
      </Footer>
    </Layout>

    <Drawer title="企业配置" width="720" :closable="true" v-model="persCent" :draggable="true">
      <Form :model="formData" label-position="right" :label-width="120" v-if="persCent">
        <Card :bordered="true" style="margin:0 0 10px;">
          <p slot="title">企业信息</p>
          <Row>
            <i-col span="12">
              <FormItem label="企业名称">
                {{formData.deptName}}
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="剩余短信">
                {{formData.configSmsNum}}条
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="定时同步运输车辆">
                <i-switch v-model="formData.configSyncVehicleWhetherOpen" @on-change="configSyncVehicleWhetherOpenFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="定时同步从业人员">
                <i-switch v-model="formData.configSyncDriverWhetherOpen" @on-change="configSyncDriverWhetherOpenFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="初始化创建台账">
                <i-switch v-model="formData.configAutoSave" @on-change="configAutoSaveFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
          </Row>
        </Card>
        <Card :bordered="true" style="margin:0 0 10px;">
          <p slot="title">到期提醒设置</p>
          <Row>
            <i-col span="8">
              <FormItem label="保险项目提醒">
                <i-switch v-model="formData.configInsuranceWhetherRemind" @on-change="configInsuranceWhetherRemindFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="年度审验提醒">
                <i-switch v-model="formData.configAnnualInspectWhetherRemind" @on-change="configAnnualInspectWhetherRemindFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="道路营运提醒">
                <i-switch v-model="formData.configOperationCertificateWhetherRemind" @on-change="configOperationCertificateWhetherRemindFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="维修保养提醒">
                <i-switch v-model="formData.configMaintainWhetherRemind" @on-change="configMaintainWhetherRemindFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="挂车税费提醒">
                <i-switch v-model="formData.configTrailerVesselTaxWhetherRemind" @on-change="configTrailerVesselTaxWhetherRemindFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>

            <i-col span="12">
              <FormItem label="保险项目提醒阈值">
                <i-input v-model="formData.configInsuranceRemindDay" placeholder="即将到期前提醒天数" @on-blur="configInsuranceRemindDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="年度审验提醒阈值">
                <i-input v-model="formData.configAnnualInspectRemindDay" placeholder="即将到期前提醒天数" @on-blur="configAnnualInspectRemindDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="道路营运提醒阈值">
                <i-input v-model="formData.configOperationCertificateRemindDay" placeholder="即将到期前提醒天数" @on-blur="configOperationCertificateRemindDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="维修保养提醒阈值">
                <i-input v-model="formData.configMaintainRemindDay" placeholder="即将到期前提醒天数" @on-blur="configMaintainRemindDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="挂车税费提醒阈值">
                <i-input v-model="formData.configTrailerVesselTaxRemindDay" placeholder="即将到期前提醒天数" @on-blur="configTrailerVesselTaxRemindDayFun" clearable/>
              </FormItem>
            </i-col>
          </Row>
        </Card>
        <Card :bordered="true" style="margin:0 0 10px;">
          <p slot="title">短信推送设置</p>
          <Row>
            <i-col span="8">
              <FormItem label="保险项目推送">
                <i-switch v-model="formData.configInsuranceSmsSend" @on-change="configInsuranceSmsSendFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="年度审验推送">
                <i-switch v-model="formData.configAnnualInspectSmsSend" @on-change="configAnnualInspectSmsSendFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="8">
              <FormItem label="道路营运推送">
                <i-switch v-model="formData.configOperationCertificateSmsSend" @on-change="configOperationCertificateSmsSendFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="维修保养推送">
                <i-switch v-model="formData.configMaintainSmsSend" @on-change="configMaintainSmsSendFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="挂车税费推送">
                <i-switch v-model="formData.configTrailerVesselTaxSmsSend" @on-change="configTrailerVesselTaxSmsSendFun">
                  <span slot="open">开</span>
                  <span slot="close">关</span>
                </i-switch>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="保险项目推送阈值">
                <i-input v-model="formData.configInsuranceSmsSendDay" placeholder="即将到期前推送天数" @on-blur="configInsuranceSmsSendDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="年度审验推送阈值">
                <i-input v-model="formData.configAnnualInspectSmsSendDay" placeholder="即将到期前推送天数" @on-blur="configAnnualInspectSmsSendDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="道路营运推送阈值">
                <i-input v-model="formData.configOperationCertificateSmsSendDay" placeholder="即将到期前推送天数" @on-blur="configOperationCertificateSmsSendDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="维修保养推送阈值">
                <i-input v-model="formData.configMaintainSmsSendDay" placeholder="即将到期前推送天数" @on-blur="configMaintainSmsSendDayFun" clearable/>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="挂车税费推送阈值">
                <i-input v-model="formData.configTrailerVesselTaxSmsSendDay" placeholder="即将到期前推送天数" @on-blur="configTrailerVesselTaxSmsSendDayFun" clearable/>
              </FormItem>
            </i-col>
          </Row>
        </Card>
      </Form>
      <Card :bordered="true" style="margin:0 0 10px;">
        <p slot="title">关于我们</p>
        <Form label-position="right" :label-width="80">
          <FormItem label="客服热线">
            0319-3303099
          </FormItem>
          <FormItem label="Q  Q">
            3488987793
          </FormItem>
          <FormItem label="联系地址">
            河北省邢台经济开发区好望角国际物流园A区18号
          </FormItem>
          <Row>
            <i-col span="12">
              <div style="text-align: center;">
                <img src="../../assets/er.png" width="160" @error="public.imgDispose" />
                <div style="font-size: 14px;font-weight: 900;">企业公众号</div>
              </div>
            </i-col>
            <!--<i-col span="12">-->
            <!--<div style="text-align: center;">-->
            <!--<img src="../../assets/er.png" width="160" @error="public.imgDispose"/>-->
            <!--<div style="font-size: 14px;font-weight: 900;">学员APP下载</div>-->
            <!--</div>-->
            <!--</i-col>-->
          </Row>

        </Form>

      </Card>
    </Drawer>

    <Modal v-model="changePassword" title="修改密码" :mask-closable="false" :loading="loading">
      <Form ref="password" :model="changePasswordData" label-position="right" :label-width="80" :rules="validatePassword">
        <FormItem label="旧密码">
          <i-input v-model="changePasswordData.oldPassword" type="password" placeholder="请输入旧密码" clearable/>
        </FormItem>
        <FormItem label="新密码" prop="newPassword">
          <i-input v-model="changePasswordData.newPassword" type="password" placeholder="请输入新密码" clearable/>
        </FormItem>
        <FormItem label="确认密码" prop="pwdCheck">
          <i-input v-model="changePasswordData.pwdCheck" type="password" placeholder="请输入确认密码" clearable/>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" size="large" @click="changePasswordCancel">取消</Button>
        <Button type="primary" size="large" @click="changePasswordOk">确定</Button>
      </div>
    </Modal>

    <Modal v-model="userInfo" title="个人信息" :mask-closable="false" :loading="userInfoLoading">
      <Form ref="userInfoS" :model="alterUserInfoData" label-position="right" :label-width="80" :rules="validateuserInfo">
        <FormItem label="用户名称" prop="name">
          <i-input v-model="alterUserInfoData.name" placeholder="用户名称" clearable/>
        </FormItem>
        <FormItem label="联系电话" prop="mobile">
          <i-input v-model="alterUserInfoData.mobile" placeholder="联系电话" clearable/>
        </FormItem>
        <FormItem label="邮箱地址" prop="email">
          <i-input v-model="alterUserInfoData.email" placeholder="邮箱地址" clearable/>
        </FormItem>

      </Form>
      <div slot="footer">
        <Button type="text" size="large" @click="userInfoCancel">取消</Button>
        <Button type="primary" size="large" @click="userInfoOk">确定</Button>
      </div>
    </Modal>

    <Drawer title="系统风格" width="300" :closable="true" v-model="systemStyleType">
      <Form label-position="right" :label-width="80" v-if="systemStyleType">
        <Divider orientation="left">整体风格</Divider>
        <div class="_wz_mainStyle">
          <Row>
            <i-col span="8">
              <div class="_wz_mainStyle_list" @click="systemStyleFun('top')">
                <img src="../../assets/top.png" @error="public.imgDispose" />
                <Icon v-if="systemStyle.systemStyle == 'top' || !!!systemStyle.systemStyle" type="md-checkmark" />
              </div>
            </i-col>
            <i-col span="8">
              <div class="_wz_mainStyle_list" @click="systemStyleFun('left')">
                <img src="../../assets/left.png" @error="public.imgDispose" />
                <Icon v-if="systemStyle.systemStyle == 'left'" type="md-checkmark" />
              </div>
            </i-col>
            <i-col span="8">
              <div class="_wz_mainStyle_list" @click="systemStyleFun('topLeft')">
                <img src="../../assets/topLeft.png" @error="public.imgDispose" />
                <Icon v-if="systemStyle.systemStyle == 'topLeft'" type="md-checkmark" />
              </div>
            </i-col>
          </Row>
        </div>

        <Divider orientation="left">主题色调</Divider>
        <div class="_wz_themeColor">
          <Row>
            <i-col span="3" v-for="item,index in subjectColorList" :key="item.name" style="margin:0 0 5px 0;">
              <div @click="subjectColorFun(item.className)" class="_wz_themeColor_list" :style="{background: item.color}">
                <Tooltip :content="item.name">
                  <div class="_wz_themeColor_list">
                    <template v-if="index == 0">
                      <Icon v-if="systemStyle.subjectColor == item.className || !!!systemStyle.subjectColor" type="md-checkmark" />
                    </template>
                    <template v-else>
                      <Icon v-if="systemStyle.subjectColor == item.className" type="md-checkmark" />
                    </template>
                  </div>
                </Tooltip>
              </div>
            </i-col>
          </Row>
        </div>

        <Divider orientation="left">其它设置</Divider>
        <FormItem label="多标签模式">
          <i-switch v-model="systemStyle.multiTabbed" @on-change="multiTabbedFun">
            <span slot="open">开</span>
            <span slot="close">关</span>
          </i-switch>
        </FormItem>
      </Form>
    </Drawer>

    <Modal v-model="InterceptUse" title="企业信息" :mask-closable="false" width="720" :footer-hide="true">
      <div style="color: #f00;padding: 10px;text-indent: 2em;font-weight: 600;">
        检测到您企业信息不完全，请尽快完善企业信息，近期更新版本后未完善企业信息的将会影响正常使用，为了避免影响正常使用，请尽快完善企业信息。（*必填项）
      </div>
      <deptInfo v-if="InterceptUse" @closeFun="closeFun" :userInfoData="userInfoData"></deptInfo>
    </Modal>


    <Modal v-model="deptInfoType" title="运输企业信息" :mask-closable="false" width="720" :footer-hide="true">
      <deptInfo v-if="deptInfoType" @closeFun="closeFun" :userInfoData="userInfoData"></deptInfo>
    </Modal>


  </div>
</template>
<script>

  import wzNav from './nav.vue'
  import wzTabs from './tabs.vue'
  import deptInfo from './deptInfo.vue'

  export default {
    components: {
      wzNav,//菜单
      wzTabs,//上面选项卡
      deptInfo,//企业信息
    },
    data() {
      return {
        exitStatus: 0,//判断退出是否显示
        InterceptUse: false,//拦截使用
        deptInfoType: false,//企业信息
        include: "",//缓存页面使用  组件名称
        navSelect: "",//nav用
        listNav: [],//tabs用
        navId: "",//tabs用
        systemStyle: {},//系统设置
        systemStyleType: false,//系统风格
        deptType: false,

        value: false,
        persCent: false,//个人信息
        formData: {},//企业配置
        changePassword: false,//修改密码状态
        changePasswordData: {},//修改密码表单数据
        userInfo: false,//用户信息show
        userInfoData: {},//用户信息
        alterUserInfoData: {},//修改用户信息
        loading: true,//修改密码加载验证
        userInfoLoading: true,//修改个人信息验证
        validatePassword: {
          newPassword: [
            {required: true, message: '请输入新密码', trigger: 'blur'},
          ],
          pwdCheck: [
            {required: true, message: '确认密码', trigger: 'blur'},
            {
              validator: (rule, value, callBack) => {
                if (this.changePasswordData.newPassword != value) {
                  callBack(new Error('新密码和确认密码应相同'));
                } else {
                  callBack()
                }
              }, trigger: 'blur'
            }
          ]
        },
        validateuserInfo: {
          name: [
            {required: true, message: '请输入用户名称', trigger: 'blur'},
          ],
          mobile: [
            {required: true, message: '请输入联系电话', trigger: 'blur'},
            {
              validator: (rule, value, callBack) => {
                /^[1][0-9]{10}$/.test(value) ? callBack() : callBack('请输入正确的联系电话')
              }, trigger: 'blur'
            }
          ],
          email: [
            {required: true, message: '请输入邮箱地址', trigger: 'blur'},
            {
              validator: (rule, value, callBack) => {
                /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(value) ? callBack() : callBack('请输入正确的邮箱地址')
              }, trigger: 'blur'
            }
          ],
        },
        //主题色list
        subjectColorList: [
          {"name": "拂晓蓝", "className": "_wz_1890ff", "color": "#1890ff"},
          {"name": "薄暮", "className": "_wz_f5222d", "color": "#f5222d"},
          {"name": "火山", "className": "_wz_fa541c", "color": "#fa541c"},
          {"name": "日暮", "className": "_wz_faad14", "color": "#faad14"},
          {"name": "明青", "className": "_wz_13c2c2", "color": "#13c2c2"},
          {"name": "极光绿", "className": "_wz_52c41a", "color": "#52c41a"},
          {"name": "极客蓝", "className": "_wz_2f54eb", "color": "#2f54eb"},
          {"name": "酱紫", "className": "_wz_722ed1", "color": "#722ed1"},
          {"name": "伯爵黑（默认）", "className": "_wz_1d1e23", "color": "#1d1e23"},
        ]
      }
    },
    computed: {// 能够监听vue数据上的变化，页面上来就执行一次，每改变一次数据就又触发。在操作数据的时候，会派生出另一个事情

    },
    beforeCreate() {//beforeCreate创建前状态

    },
    created() {//created创建完毕状态

    },
    beforeMount() {//beforeMount挂载前状态   DOM 元素然后塞入页面的过程

    },
    mounted() {//mounted 挂载结束状态
      var that = this;
      //退出是否显示
      that.exitStatus = !!sessionStorage.getItem('exitStatus') ? sessionStorage.getItem('exitStatus') : 0;

      console.log("%c客服热线 :0319-3303099\n\n" +
        "Q Q : 3488987793\n\n" +
        "联系地址 : 河北省邢台经济开发区好望角国际物流园A区18号", 'color:#f00');


      //localStorage.setItem("site", "js8.in"); 存储
      //localStorage.getItem('username')获取
      // localStorage.clear(); 清除
      //获取主题设置
      if (!!localStorage.getItem('systemStyle')) {
        that.systemStyle = JSON.parse(localStorage.getItem('systemStyle'));
      }

      if (JSON.parse(sessionStorage.getItem('loginData')).authority.SAFETY.includes("manage:personalCenter:personalCenter:view")) {
        //个人信息
        that.axios.get(that.apiUrl.managementUserGetNowUser)
        .then(res => {
          if (!!res) {
            that.userInfoData = JSON.parse(JSON.stringify(res.data.data));
            //校验企业信息
            that.axios.get(that.apiUrl.coreManagementDeptPerfect).then(res => {
              if (!!res) {
                var dataType = res.data.data
                if (!!!dataType) {
                  that.InterceptUse = true;
                }
              }
            }).catch(err => {
              console.log('失败', err);
            })
          }
        }).catch(err => {
          console.log('失败', err);
        })
      }
      if (JSON.parse(sessionStorage.getItem('loginData')).authority.SAFETY.includes("manage:personalCenter:companyConfig:view")) {
        //企业配置
        that.axios.get(that.apiUrl.configRemindInfo)
        .then(res => {
          if (!!res) {
            that.formData = res.data.data;
          }
        }).catch(err => {
          console.log('失败', err);
        })
      }

    },
    methods: {//执行的方法
      handleFullscreen() {
        let main = document.body
        if (this.value) {
          if (document.exitFullscreen) {
            document.exitFullscreen()
          } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen()
          } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen()
          } else if (document.msExitFullscreen) {
            document.msExitFullscreen()
          }
          this.value = false;
        } else {
          if (main.requestFullscreen) {
            main.requestFullscreen()
          } else if (main.mozRequestFullScreen) {
            main.mozRequestFullScreen()
          } else if (main.webkitRequestFullScreen) {
            main.webkitRequestFullScreen()
          } else if (main.msRequestFullscreen) {
            main.msRequestFullscreen()
          }
          this.value = true;
        }
      },
      changeMenu(name) {//退出
        var that = this;
        if (name == "user") {//个人信息
          //个人信息
          that.axios.get(that.apiUrl.managementUserGetNowUser)
          .then(res => {
            if (!!res) {
              that.alterUserInfoData = JSON.parse(JSON.stringify(res.data.data));
            }
          }).catch(err => {
            console.log('失败', err);
          })
          that.userInfo = true;
        } else if (name == "logOff") {//退出登录
          that.$Spin.show();
          if (!!JSON.parse(sessionStorage.getItem('loginData')).refresh_token) {
            var data = that.qs.stringify({
              "refresh_token": JSON.parse(sessionStorage.getItem('loginData')).refresh_token,
              "grant_type": "refresh_token",
              "client_id": "xd-client",
              "client_secret": "xd-secret",
              "platformCode" : "SAFETY",
              "platformClient" : "PC",
            })

            that.axios.post(that.apiUrl.oauthToken, data, {headers: {'Content-Type': "application/x-www-form-urlencoded"}})
            .then(res => {
            }).catch(err => {
              console.log("失败", err)

            })
          }
          sessionStorage.clear();// 删除所有数据
          location.reload()
        } else if (name == "allocation") {//企业配置
          //企业配置
          that.axios.get(that.apiUrl.configRemindInfo)
          .then(res => {
            if (!!res) {
              that.formData = res.data.data;
              that.persCent = true;
            }
          }).catch(err => {
            console.log('失败', err);
          })
        } else if (name == "password") {//修改密码
          that.changePassword = true;
          that.changePasswordData = {};

        } else if (name == 'deptInfo') {//企业信息
          that.deptInfoType = true;
        }
      },

      /////////////////////////////////////企业配置////////////////////////////////////////////
      configInsuranceWhetherRemindFun(data) {//保险是否提醒
        this.confModi({configInsuranceWhetherRemind: data})
      },
      configInsuranceRemindDayFun(data) {//保险提前提醒天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configInsuranceRemindDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configInsuranceRemindDay: this.formData.configInsuranceRemindDay})
      },
      configAnnualInspectWhetherRemindFun(data) {//年检是否提醒
        this.confModi({configAnnualInspectWhetherRemind: data})
      },
      configAnnualInspectRemindDayFun(data) {//年检提前提醒天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configAnnualInspectRemindDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configAnnualInspectRemindDay: this.formData.configAnnualInspectRemindDay})
      },
      configOperationCertificateWhetherRemindFun(data) {//营运证是否提醒
        this.confModi({configOperationCertificateWhetherRemind: data})
      },
      configOperationCertificateRemindDayFun(data) {//营运证提前提醒天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configOperationCertificateRemindDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configOperationCertificateRemindDay: this.formData.configOperationCertificateRemindDay})
      },
      configMaintainWhetherRemindFun(data) {//维保是否提醒
        this.confModi({configMaintainWhetherRemind: data})
      },
      configSyncVehicleWhetherOpenFun(data) {//定时同步运输车辆
        this.confModi({configSyncVehicleWhetherOpen: data})
      },
      configSyncDriverWhetherOpenFun(data) {//定时同步从业人员
        this.confModi({configSyncDriverWhetherOpen: data})
      },
      configAutoSaveFun(data) {//是否自动创建保险、运营、年检记录
        this.confModi({configAutoSave: data})
      },
      configMaintainRemindDayFun(data) {//维保提前提醒天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configMaintainRemindDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configMaintainRemindDay: this.formData.configMaintainRemindDay})
      },
      configTrailerVesselTaxWhetherRemindFun(data) {//挂车车船税是否提醒
        this.confModi({configTrailerVesselTaxWhetherRemind: data})
      },
      configTrailerVesselTaxRemindDayFun(data) {//挂车车船税提前提醒天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configTrailerVesselTaxRemindDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configTrailerVesselTaxRemindDay: this.formData.configTrailerVesselTaxRemindDay})
      },


      configInsuranceSmsSendFun(data) {//保险到期是否发送短信（默认关闭）
        this.confModi({configInsuranceSmsSend: data})
      },
      configInsuranceSmsSendDayFun(data) {//保险到期提前发送短信天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configInsuranceSmsSendDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configInsuranceSmsSendDay: this.formData.configInsuranceSmsSendDay})
      },
      configAnnualInspectSmsSendFun(data) {//年检到期是否发送短信（默认关闭）
        this.confModi({configAnnualInspectSmsSend: data})
      },
      configAnnualInspectSmsSendDayFun(data) {//年检到期提前发送短信天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configAnnualInspectSmsSendDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configAnnualInspectSmsSendDay: this.formData.configAnnualInspectSmsSendDay})
      },
      configOperationCertificateSmsSendFun(data) {//营运证到期是否发送短信（默认关闭）
        this.confModi({configOperationCertificateSmsSend: data})
      },
      configOperationCertificateSmsSendDayFun(data) {//营运证到期提前发送短信天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configOperationCertificateSmsSendDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configOperationCertificateSmsSendDay: this.formData.configOperationCertificateSmsSendDay})
      },
      configMaintainSmsSendFun(data) {//维保到期是否发送短信（默认关闭）
        this.confModi({configMaintainSmsSend: data})
      },
      configMaintainSmsSendDayFun(data) {//维保到期提前发送短信天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configMaintainSmsSendDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configMaintainSmsSendDay: this.formData.configMaintainSmsSendDay})
      },
      configTrailerVesselTaxSmsSendFun(data) {//挂车车船税到期是否发送短信（默认关闭）
        this.confModi({configTrailerVesselTaxSmsSend: data})
      },
      configTrailerVesselTaxSmsSendDayFun(data) {//挂车车船税到期提前发送短信天数
        var reg = /^[0-9]*$/;
        if (!reg.test(this.formData.configTrailerVesselTaxSmsSendDay)) {
          this.$Message.warning('请输入有效数字');
          return false;
        }
        this.confModi({configTrailerVesselTaxSmsSendDay: this.formData.configTrailerVesselTaxSmsSendDay})
      },
      confModi(data) {
        var that = this;
        data.id = that.formData.id;
        data.deptUuid = that.userInfoData.deptUuid;
        var obj = that.qs.stringify(data);
        that.axios.post(that.apiUrl.configRemindUpdate, obj, {headers: {'Content-Type': "application/x-www-form-urlencoded"}})
        .then(res => {

        }).catch(err => {
          console.log('失败', err);
        })
      },


      //缩略图查看
      handleView(src) {
        this.imgSrc = src;
        this.visible = true;
      },
      /////////////////////////////////////企业配置////////////////////////////////////////////
      changePasswordOk() {//修改密码提交
        var that = this;
        that.loading = true;
        that.$refs["password"].validate((valid) => {
          that.loading = false;
          if (valid) {
            that.axios.post(that.apiUrl.managementUserUpdatePass, that.changePasswordData)
            .then(res => {
              if (!!res) {
                that.changePassword = false;
                that.$Message.success('密码修改成功');
              }
            }).catch(err => {
              console.log('失败', err);
            })
          } else {
            that.$Message.error('请正确填写表单');
          }
        })
      },
      changePasswordCancel() {//修改密码取消
        this.changePasswordData = {};
        this.changePassword = false;
      },
      userInfoOk() {//个人信息提交
        var that = this;
        that.userInfoLoading = true;
        that.$refs["userInfoS"].validate((valid) => {
          that.userInfoLoading = false;
          if (valid) {
            var alterUserInfoData = {
              name: that.alterUserInfoData.name,
              mobile: that.alterUserInfoData.mobile,
              email: that.alterUserInfoData.email
            };
            that.axios.post(that.apiUrl.managementUserUpdate, alterUserInfoData)
            .then(res => {
              if (!!res) {
                that.userInfo = false;
                that.$Message.success('个人信息修改成功');
                //刷新 token
                var data = that.qs.stringify({
                  "refresh_token": JSON.parse(sessionStorage.getItem('loginData')).refresh_token,
                  "grant_type": "refresh_token",
                  "client_id": "xd-client",
                  "client_secret": "xd-secret",
                  "platformCode" : "SAFETY",
                  "platformClient" : "PC",
                })
                that.axios.post(that.apiUrl.oauthToken, data, {headers: {'Content-Type': "application/x-www-form-urlencoded"}})
                .then(res => {
                  sessionStorage.setItem("loginData", JSON.stringify(res.data));
                  //个人信息
                  that.axios.get(that.apiUrl.managementUserGetNowUser)
                  .then(res => {
                    if (!!res) {
                      that.userInfoData = JSON.parse(JSON.stringify(res.data.data));
                    }
                  }).catch(err => {
                    console.log('失败', err);
                  })
                  //个人信息
                }).catch(err => {
                  that.$Spin.hide();
                  console.log('失败', err);
                })
                //刷新 token

              }
            }).catch(err => {
              console.log('失败', err);
            })
          } else {
            that.$Message.error('请正确填写表单');
          }
        })
      },
      userInfoCancel() {//个人信息取消
        this.userInfoData = {};
        this.userInfo = false;
      },
      refreshToke() {
        var that = this;
        var data = that.qs.stringify({
          "refresh_token": JSON.parse(sessionStorage.getItem('loginData')).refresh_token,
          "grant_type": "refresh_token",
          "client_id": "xd-client",
          "client_secret": "xd-secret",
          "platformCode" : "SAFETY",
          "platformClient" : "PC",
        })

        that.axios.post(that.apiUrl.oauthToken, data, {headers: {'Content-Type': "application/x-www-form-urlencoded"}})
        .then(res => {
          if (!!res) {
            sessionStorage.setItem("loginData", JSON.stringify(res.data));
            location.reload()
          } else {
            sessionStorage.clear();// 删除所有数据
            router.push({
              path: "/"
            })
          }
        }).catch(err => {
          that.$Spin.hide();
          console.log("失败", err)
          that.$Message.error({
            content: "未识别到您的身份，请重新登录",
            onClose: function () {
              // sessionStorage.clear();// 删除所有数据
              // router.push({
              //   path: "/"
              // })
            }
          });
        })
      },

      //系统风格设置
      systemStyleTypeFun() {
        this.systemStyleType = true;
      },
      //整体风格设置
      systemStyleFun(data) {
        var that = this;
        that.systemStyle.systemStyle = data;
        if (!!localStorage.getItem('systemStyle')) {
          var systemStyle = JSON.parse(localStorage.getItem('systemStyle'));
          systemStyle.systemStyle = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        } else {
          var systemStyle = that.systemStyle;
          systemStyle.systemStyle = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        }
      },
      //主题色调
      subjectColorFun(data) {
        var that = this;
        that.systemStyle.subjectColor = data;
        if (!!localStorage.getItem('systemStyle')) {
          var systemStyle = JSON.parse(localStorage.getItem('systemStyle'));
          systemStyle.subjectColor = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        } else {
          var systemStyle = that.systemStyle;
          systemStyle.subjectColor = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        }
      },
      //多页签开关
      multiTabbedFun(data) {
        var that = this;
        that.systemStyle.multiTabbed = data;
        if (!!localStorage.getItem('systemStyle')) {
          var systemStyle = JSON.parse(localStorage.getItem('systemStyle'));
          systemStyle.multiTabbed = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        } else {
          var systemStyle = that.systemStyle;
          systemStyle.multiTabbed = data;
          localStorage.setItem('systemStyle', JSON.stringify(systemStyle))
        }
      },
      leftNavList(name) {//接受top选中的数据传输到nav.vue里面触发选中
        var that = this;
        that.navSelect = name;
        that.navId = name;
      },
      openNavFun(name) {//关闭标签清除数据
        var that = this;
        var tab = that.getTab(name);
        if (!!tab) tab.show = false;

        //清除指定缓存页面数据
        var include = that.include.split(',');
        for (var i = 0; i < include.length; i++) {
          if (name == include[i]) {
            include.splice(i, 1)
            that.include = include.join(',');
          }
        }
      },
      getTab(data) {
        var that = this;
        var listNav = that.listNav;
        for (var i = 0; i < listNav.length; i++) {
          if (listNav[i].data == data) {
            //that.listNav.splice(i,1);
            return listNav[i];
          }
        }
        return false;
      },
      topNavListFun(dataIf) {//获得nav.vue点击菜单的数据 传输给tabs.vue   菜单数据  菜单名称
        var that = this;
        that.navSelect = dataIf.data;//tabs 处于选中状态的 菜单
        that.navId = dataIf.data;
        var tab = that.getTab(dataIf.data);
        if (!tab) {
          dataIf.show = true;
          that.listNav.push(dataIf);//获取数据 传输给tabs.vue展示
        } else {
          tab.show = true;
        }

        if (!that.getTab(dataIf.data)) {
          if (that.include.length > 0) {
            that.include = that.include + "," + dataIf.data
          } else {
            that.include = that.include + dataIf.data
          }
        }
      },
      //关闭 弹出框刷新列表
      closeFun() {
        this.deptInfoType = false;
        this.InterceptUse = false;
      },
    },
    watch: {//监听
      include: function (a, v) {

      }
    },

    props: {//接收来自父组件的数据
    },
    beforeUpdate() {//beforeUpdate 更新前状态

    },
    updated() {//updated 更新完成状态

    },
    beforeDestroy() {//beforeDestroy 销毁前状态

    },
    destroyed() {//destroyed 销毁完成状态

    }
  }
</script>
<style lang="less" scoped>
  .layout {
    border: 1px solid #d7dde4;
    background: #f5f7f9;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
  }

  .layout-logo {
    height: 50px;
    margin-top: 8px;
    float: left;

    img {
      height: 100%;
    }
  }

  .user-avatar-dropdown {
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;

    .ivu-badge-dot {
      top: 16px;
    }
  }

  .ivu-layout-sider-children {
    overflow: hidden;
    overflow-y: auto;

  }

  .ivu-layout-sider-children::-webkit-scrollbar {
    width: 0px;
    height: 0px;
  }

  .ivu-layout-header, .ivu-menu-dark {
    background: #fff;
  }

  .ivu-layout-header {
    box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
    position: relative;
    z-index: 901;
  }

  .ivu-menu-vertical.ivu-menu-light:after {
    display: none !important;
  }

  .ivu-layout-sider {
    box-shadow: 2px 0 8px 0 rgba(29, 35, 41, .05);
    position: relative;
    z-index: 2;
  }

  ._wz_foot {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    /*background: #313131;*/
    height: 30px;
    line-height: 30px;
    text-align: center;
    /*color: #fff;*/
    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
    background: #fff;

    span {
      margin: 0 15px;
      letter-spacing: 2px;
    }
  }

  .demo-upload-list {
    display: inline-block;
    width: 120px;
    height: 80px;
    text-align: center;
    line-height: 80px;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;
    border: 1px solid rgba(0, 0, 0, .2);
    margin-right: 4px;
  }

  .demo-upload-list img {
    width: 100%;
    height: 100%;
  }

  .demo-upload-list-cover {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, .6);
  }

  .demo-upload-list:hover .demo-upload-list-cover {
    display: block;
  }

  .demo-upload-list-cover i {
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
  }
</style>
<style lang="less">
  ._wz_cent_main {
    background: #f5f7f9;
    /*background:#fff;*/
    padding: 10px;
    height: 100%;
    width: 100%;
    position: relative;
    overflow: auto;
  }

  .demo-spin-icon-load {
    animation: ani-demo-spin 1s linear infinite;
  }

  .ivu-page-options-elevator input {
    height: 30px;
  }

  ._wz_main_css {
    .layout-nav {
      text-align: right;
      width: 420px;
      margin: 0 auto;
      margin-right: 0px;
      color: #1d1e23;

      .ivu-dropdown {
        text-align: left;
      }

      a {
        color: #1d1e23;
      }

      .ivu-dropdown-menu a {
        color: #1d1e23;
      }
    }
  }

  /*.ivu-spin,.ivu-spin-dot{*/
  /*color: #fff;*/
  /*}*/
  /*.ivu-spin-fix{*/
  /*background-color:rgba(0,0,0,0.6);*/
  /*}*/

  ._wz_mainStyle {
    ._wz_mainStyle_list {
      position: relative;
      width: 48px;
      height: 42px;
      margin: auto;
      cursor: pointer;

      img {
        width: 100%;
        height: 100%;
      }

      i {
        position: absolute;
        z-index: 2;
        font-size: 18px;
        color: #1890ff;
        top: 20px;
        left: 20px;
      }
    }
  }

  ._wz_themeColor {
    ._wz_themeColor_list {
      cursor: pointer;
      width: 20px;
      height: 20px;
      margin: auto;
      position: relative;
      text-align: center;
      line-height: 20px;
      border-radius: 5px;

      i {
        font-size: 12px;
        color: #fff;
      }
    }
  }

  //拂晓蓝（默认）
  ._wz_1890ff {
    background: #1890ff !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #1890ff !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //薄暮
  ._wz_f5222d {
    background: #f5222d !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #f5222d !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //火山
  ._wz_fa541c {
    background: #fa541c !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #fa541c !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //日暮
  ._wz_faad14 {
    background: #faad14 !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #faad14 !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //明青
  ._wz_13c2c2 {
    background: #13c2c2 !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #13c2c2 !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //极光绿
  ._wz_52c41a {
    background: #52c41a !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #52c41a !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //极客蓝
  ._wz_2f54eb {
    background: #2f54eb !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #2f54eb !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //酱紫
  ._wz_722ed1 {
    background: #722ed1 !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #722ed1 !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  //伯爵黑
  ._wz_1d1e23 {
    background: #1d1e23 !important;
    color: #fff !important;

    .ivu-menu-dark {
      background: #1d1e23 !important;
      color: #fff !important;

      .layout-nav, .layout-nav a {
        color: #fff !important;
      }
    }
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      left: -60px;
      border-right: 60px solid transparent;
      -webkit-filter: drop-shadow(60px 0px #fff);
      filter: drop-shadow(60px 0px #fff);
      float: left;
    }
  }

  .ivu-tabs-bar {
    margin-bottom: 0px;
  }

  //统一车牌颜色
  ._wz_vehiclePlateColor {
    display: inline-block;
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    font-size: 12px;
    white-space: nowrap;
    text-align: center;
    border: none;
    border-radius: 2px;
    cursor: pointer;
  }

  ._wz_main_css {
    ._wz_main_logo {
      overflow: hidden;
      height: 60px;
      width: 60px;
      background: url('../../assets/12.png') no-repeat 0 0;
      background-size: 60px 60px;
      position: relative;
      float: left;
    }
  }

</style>
